<!DOCTYPE html>
<html lang="zh-cn">
<head>
  <title><if condition="$customerManagerConfig['login_title']">{$customerManagerConfig['login_title']}<else/>东辉微商管理系统</if></title>
  <meta charset="utf-8"/>
  <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  <!--[if lt IE 9]>
  <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
  <![endif]-->
  <link rel="stylesheet" href="http://cdn.bootcss.com/twitter-bootstrap/3.0.3/css/bootstrap.min.css">
  <style>
    body{font-family: "Microsoft YaHei";}
    .wmfl-admin-login{position:absolute; width:100%; top:150px; z-index:999;}
    .wmfl-login-wrap .input-group{margin-bottom:10px;}
    .wmfl-login-wrap h3{font-family: "Microsoft YaHei";}
    .wmfl-login-wrap form{margin:10px 20px;}
    .wmfl-intro{text-align: center;}
    .wmfl-title{padding: 10px;}
    .wmfl-qrcode{background: #fff; padding: 10px; width: 445px; border-radius: 5px;}
    .wmfl-qrcode img{width: 425px;}
    .wmfl-login-lay{overflow:hidden; position:absolute; left:0; top:0; z-index:-1;}
	.wmfl-admin-bottom{ position:absolute; bottom:0px; color:#fff; width: 100%; text-align: center; margin-bottom:5px;}
    #auth{width:100px;}
    #submit{margin-right:5px;}
    #message{margin-left: 10px;}
  </style>
</head>
<body>
  <section class="wmfl-admin-login">
    <div class="container">
      <div class="col-lg-5">
      	<div class="wmfl-intro">
        	<div class="wmfl-qrcode">
        	<span><img src="<if condition="$customerManagerConfig['login_logo']">{$customerManagerConfig['login_logo']}<else/>__PUBLIC__/Style/Common/images/donghui_logo.png</if>"/></span>
        	<p class="wmfl-title">东辉微商管理系统</p>
        	</div>
        </div>
      </div>
      
      <div class="col-lg-1">
        <div class="wmfl-intro">
        	<!--<div class="wmfl-qrcode">
        	<span><img src="__PUBLIC__/Style/Common/images/qrcode.jpg"/></span>
        	<p>使用微信扫描二维码，体验微商客户案例</p>
        	</div>-->
        </div>
      </div>
      
      <div class="col-lg-5">
        <div class="wmfl-login-wrap panel panel-primary">
          <div class="panel-heading">
            <if condition="$customerManagerConfig['login_form_logo']"><img src="{$customerManagerConfig['login_form_logo']}" style="float: right;"/></if>
            <h3><if condition="$customerManagerConfig['form_text']">{$customerManagerConfig['form_text']}<else/>{$moduleTitle}</if></h3>
          </div>
          <form action="" method="post" role="form" class="panel-body" id="form">
            
            <div class="input-group">
              <span class="input-group-addon">邮　箱</span>
              <input type="email" class="form-control" name="email" id="email" placeholder="输入登录邮箱" />
            </div>
            
            <div class="input-group">
              <span class="input-group-addon">密　码</span>
              <input type="password" class="form-control" name="password" id="password" placeholder="输入登录密码" />
            </div>
            
            <div class="input-group">
              <span class="input-group-addon">验证码</span>
              <input type="text" class="form-control" name="verify" id="auth" />
              <img class="auth-img" src="__CONTROLLER__/verify" title="点击更换验证码" style="cursor:pointer;"/>
            </div>
            
            <div class="input-group">
              <span class="input-group-addon invisible">密　码</span>
              <button type="submit" class="btn btn-primary" id="submit">登录</button>
              <a class="btn btn-success" href="__CONTROLLER__/register">免费注册试用</a>
              <span id="message"></span>
            </div>
            
          </form>
        </div>
      </div>
      
    </div>
  </section>
  <section class="wmfl-admin-bottom">
	©2014 <a href="#">观元科技</a> All Rights Reserved
  </section>
  <div id="wmfl-login-lay" class="wmfl-login-lay"></div>
  <script src="http://cdn.bootcss.com/jquery/1.10.2/jquery.min.js"></script>
  <script src="http://cdn.bootcss.com/twitter-bootstrap/3.0.3/js/bootstrap.min.js"></script>
  <script type="text/javascript">
    var img =  {$customerManagerConfig['backgroundimgs']};
    if( img.length == 0 ) {
    	img = ["__PUBLIC__/Style/Admin/Default/images/wmlogin_bg1.jpg",
	   	       "__PUBLIC__/Style/Admin/Default/images/wmlogin_bg3.jpg"];
    }
    //防止iframe嵌套
    $(function(){
      if(window != top){top.location.href = location.href;}  
    });
  
    $(function(){
      var oLay = $("#wmfl-login-lay"),
        w = $(window).width(),
        h = $(window).height();
      oLay.css({width: w + "px", height: h + "px"});
      
      var random = Math.floor(Math.random()*img.length);
      var oImg = new Image();
      oImg.src = img[random];
      oImg.onload = function(){
        //控制宽高
        var _thisW = this.width;
        var _thisH = this.height;
        (w/h) > (_thisW/_thisH) ? (this.width = w) : (this.height = h);

        $(this).fadeIn(1000);
        $(this).appendTo(oLay);  
      };
      
      $(".auth-img").click(function(){
        $(this).attr("src", "__CONTROLLER__/verify?"+new Date().getTime());
      });
    });
    
    $(window).resize(function(){
      var  oLay = $("#wmfl-login-lay"),
        w = $(window).width(),
        h = $(window).height(),
        oImg = new Image(),
        img = oLay.children("img");
      oImg.src = img.attr("src");
      var _thisW = oImg.width,
        _thisH = oImg.height,
        imgScale = _thisW/_thisH;
        documentScale = w/h;
      
      oLay.css({width: w+"px", height: h+"px"});
      if(documentScale < imgScale){
        img.css({width: h*imgScale + "px", height: h + "px"});
      }else{
        img.css({width: w + "px", height: w/imgScale + "px"});
      }
      img.css({top:(img.outerHeight() - h + "px")});
    });
    
    //表单提交
    document.onkeydown = function(ev)
    {
      var oEvent = ev || window.event;
      if(oEvent.keyCode == 13){
        return submitForm();
      };
    }
    
    $("#submit").click(function(){
      return submitForm();
    });
    
    
    function submitForm()
    {
      var msg = $("#message"),
        emailVal = $("#email").val(),
        passVal = $("#password").val(),
        authVal = $("#auth").val();
      
      if( emailVal == "" ) {
        msg.html("登录邮箱不能为空");
        $("#email").focus();
      } else if( passVal == "" ){
        msg.html("登录密码不能为空");
        $("#password").focus();
      } else if( authVal == "" ) {
        msg.html("验证码不能为空");
        $("#auth").focus();
      } else {
        $("#submit").html("登录中……").attr("disabled", "true");
        msg.html("");
        
        $.post("__CONTROLLER__/login",$("#form").serialize(),function(data){
          if(data.error == 0)
          {
            setTimeout(function(){
              location.href = "__MODULE__/index";
            },1000)
          }else{
            $("#submit").html("登录").removeAttr("disabled");
            $(".auth-img").attr("src", "__CONTROLLER__/verify?"+new Date().getTime());
          }
          msg.html(data.message);
        },'json');
      }
      return false;
    };
    
    
    //对支持本地存储的浏览器储存填入的email，可以存储多至5M的数据。这一定可以为用户带来更好的用户体验。
    if(window.FileReader){
      var email = document.getElementById("email");
      if( localStorage.getItem("email") ){
        email.value = localStorage.getItem("email");
      }
      function storageEmail(){
        localStorage.setItem("email", this.value);
      }
      email.addEventListener("keyup", storageEmail, false);
    }
    
  </script>
  <!--<script src="__PUBLIC__/Static/js/snow.js" type="text/javascript" charset="utf-8"></script>-->
</body>
</html>

